<template>
  <div>
    <input type="text" @input="seach" v-model="ip" />
    <ul>
      <li v-for="i in arrnew">{{ i }}</li>
    </ul>
    <div id="d1" v-show="true"></div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      arr: ["阿迪鞋子", "耐克鞋子", "乔丹鞋子", "361度鞋子"],
      arrnew: [],
      ip: "",
      
    };
  },
  methods: {
    seach() {
      //先把数组清空这样就不会push空的东西进去
      this.arrnew = [];
      this.arr.forEach((item) => {
        //如果输入框里面有值再执行下面代码
        if (this.ip) {
          //如果arr数组数据里面包含我们输入的值
          if (item.includes(this.ip)) {
            this.arrnew.push(item);
          }
        }
      });
    },
  },
};
</script>
<style  lang="css">
  #d1{
      width: 500px;
      height: 500px;
      background: red;
  }
</style>

